<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <title>数据代理实现的原理</title>
        <script type="text/javascript" src="../js/vue.js"></script>
    </head>
    <body>
        <!-- 准备好一个容器-->
        <div id="root">
            
        </div>
    </body>
        <script type="text/javascript">
            Vue.config.productionTip = false
            // 模拟Vue收到程序员传进来的data,存入到_data中
            let _data = {
                name:'尚硅谷'
            }

            // 模拟一个vm
            let vm = {
                $attrs:'123',
				$listeners:[],
				$a:1,
				$b:2,
            }

            // 增强对象(给对象增加指定属性)
            Object.defineProperty(vm,'name',{
                get(){
                    console.log('有人读取vm.name')
                    return _data.name
                },
                set(value){
                    console.log('有人修改vm.name')
                    _data.name = value
                }
            })
        </script>
</html>